<template>
	<uni-nav-bar title="新增服务站存量调整" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package">
		<view class="space-between">
			<view>调整加注量</view>
			<input class="uni-input" maxlength="10" placeholder="请输入调整加注量" v-model="amount" @input="inputeve" />
		</view>
		<view class="space-between lists" style="margin-top:10rpx">
			<view>服务站</view>
			<hpy-form-select :dataList="keyList" text="name" name="value" @change="consolu" :Text="keyName"
				state="admin" :icon='true' />
		</view>
	</view>
	<view class="package">
		<view style="margin-bottom: 10rpx;">备注</view>
		<textarea class="textarea" v-model="value" placeholder="请简单描述..." :auto-height='true'></textarea>
	</view>
	<view class="add" @click="BulletBox()">确认</view>
	<!-- 确认调整信息 -->
	<Adjust @submit="submit" ref="djust" :changeMoney="changeMoney" type='溶液存量'></Adjust>
</template>

<script setup lang="ts">
	import { navBack } from '@/utils/navigator';
	import { errorToast, showLoading, successToast } from '@/utils/prompt';
	import Adjust from '@c/administrator/BulletBox/adjust.vue';
	import { toPublish } from '@mqtt';
	import { getServiceAreaList } from '@/gql/administrator';
	import { ref, nextTick } from 'vue';
	import { getDriverID } from '@/stores/driverID';
	const admin_id = getDriverID();
	/**
	 * 新增服务站存量调整
	 * @param {String} keyName  服务站名称
	 * @param {Number} keyId  服务站ID
	 * @param {String} amount  服务站调整存量
	 * @param {String} value  调整备注
	 * @param {Null} djust  确认调整信息弹框
	 * @param {Object} changeMoney  确认调整信息
	 */
	const keyName = ref('请选择服务站'); //服务站名称
	const keyId = ref();//服务站ID
	const keyList = ref([]); // 服务站列表
	const value = ref('')
	const djust = ref(null)
	const changeMoney = ref({})
	const amount = ref('')
	/**
	 * 切换服务站ID
	 * @param {String} e.data.name  服务站名称
	 * @param {Number} e.data.id  服务站ID
	 * @param {String} e.data.amount  服务站存量
	 */
	function consolu(e : any) {
		console.log(JSON.stringify(e))
		keyName.value = e.data.name;
		keyId.value = e.data.id;
		changeMoney.value.money = e.data.amount;
	}
	// 获取服务站列表
	service()
	function service() {
		showLoading()
		const payload = {
			query: getServiceAreaList
		};
		toPublish('ql/control/getServiceAreaList',
			payload,
			(obj : any) => {
				uni.hideLoading();
				const { getServiceAreaList } = obj.data;
				keyList.value = getServiceAreaList
			},
		);
	}
	/**
	 * 输入调整加注量
	 */
	function inputeve(e : any) {
		let val = e.detail.value.replace(/(^\s*)|(\s*$)/g, '');
		if (!val) {
			amount.value = '';
			return;
		}
		val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');
		nextTick(function () {
			amount.value = val;
		});
	}
	/**
	 * 提交调整数据
	 */
	function submit() {
		showLoading()
		const payload = {
			admin_id,
			id: Number(keyId.value),
			amount: amount.value,
			remarks: value.value
		};
		toPublish(
			'control/addBillServiceArea',
			payload,
			(obj : any) => {
				uni.hideLoading();
				const { code, msg } = obj;
				if (code === 1) {
					successToast(msg)
					navBack()
				} else {
					errorToast(msg)
				}
			}
		);
	}
	/**
	 * 弹出确认调整前后数据弹框
	 */
	function BulletBox() {
		if (!amount.value) {
			errorToast('请输入加注量')
			return
		}
		if (!keyId.value) {
			errorToast('请选择服务站')
			return
		}
		changeMoney.value.price = amount.value
		const a1 = Number(changeMoney.value.money) + Number(amount.value);
		changeMoney.value.total = Number((a1).toFixed(2));
		djust.value.openBankPad()
	}
</script>

<style scoped lang="less">
	.add {
		width: 480rpx;
		height: 100rpx;
		background: linear-gradient(-10deg, #2C96F9, #1B91FF);
		border-radius: 5px;
		text-align: center;
		line-height: 100rpx;
		color: #fff;
		margin: 60rpx auto 20rpx;
		font-size: 32rpx;
	}

	input {
		text-align: right;
	}
</style>
<style>
	.lists>>>.select-picker {
		justify-content: flex-end;
		text-align: right;
	}
</style>